<template>
  <div>
    <el-menu
      style="width: 250px; min-height: calc(100vh - 65px)"
      active-text-color="#ffd04b"
      background-color="#545c64"
      class="el-menu-vertical-demo"
      :default-active="path"
      text-color="#fff"
      router
      scroll
    >
      <el-sub-menu index="userabout">
        <template #title><span>用户相关</span></template>
        <el-menu-item index="./userInfo"> 用户基本信息 </el-menu-item>
        <!-- <el-menu-item index="./contribution"> 用户投稿 </el-menu-item> -->
      </el-sub-menu>
      <el-sub-menu index="./productionInfo">
        <template #title>
          <span>作品相关</span>
        </template>
        <el-menu-item index="./production"> 作品管理 </el-menu-item>
        <!-- <el-menu-item index="./comment"> 作品评论管理 </el-menu-item> -->
      </el-sub-menu>
      <el-menu-item index="./administration" style="width: 250px">
        <span>管理员账户</span>
      </el-menu-item>
      <el-menu-item index="./carousel">
        <span>轮换图设置</span>
      </el-menu-item>
    </el-menu>
  </div>
</template>
<style></style>
<script setup>
import { ref, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router";

const router = useRouter();
const route = useRoute();

const path = ref("./" + route.path.split("/")[2]);
console.log(path.value);
console.log(route.path.split("/"), router);
</script>
